<template>
	<view>
		<scroll-view class="floor-list" scroll-x>
			<view class="scoll-wrapper">
				<view 
					v-for="(item, index) in goodsList" :key="index"
					class="floor-item"
					@click=""
				>
					<image :src="item.image" mode="aspectFill"></image>
					<text class="title clamp">{{item.title}}</text>
					<text class="price">￥{{item.price}}</text>
				</view>
			</view>
		</scroll-view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				goodsList:[
					{
						image: "/static/logo.jpg",
						title: "古黛妃 短袖t恤女夏装2019新款韩版宽松",
						price: 179,
						sales: 61,
					},
					{
						image: "/static/logo.jpg",
						title: "潘歌针织连衣裙",
						price: 78,
						sales: 16,
					},
					{
						image: "/static/logo.jpg",
						title: "巧谷2019春夏季新品新款女装",
						price: 108.8,
						sales: 5,
					}, {
						image: "/static/logo.jpg",
						title: "私萱连衣裙",
						price: 265,
						sales: 88,
					}, {
						image: "/static/logo.jpg",
						title: "娇诗茹 ulzzang原宿风学生潮韩版春夏短",
						price: 422,
						sales: 137,
					}
				]
			}
		},
		methods: {
			
		}
	}
</script>

<style lang="scss" scoped>
.scoll-wrapper{
	display:flex;
	align-items: flex-start;
	.floor-item{
		width: 150upx;
		margin-right: 20upx;
		font-size: $font-sm+2upx;
		color: $font-color-dark;
		line-height: 1.8;
		image{
			width: 150upx;
			height: 150upx;
			border-radius: 6upx;
		}
		.price{
			color: $uni-color-primary;
		}
	}
}

</style>
